<template>
  <headsVue></headsVue>
  <div class="Rookies_home">
    <div id="home" class="rookheas">
      <homeVue />
    </div>
    <div id="about" class="rookheas">
      <abouts />
    </div>
    <div id="love" class="rookheas">
      <love />
    </div>
    <div id="donation" class="rookheas">
      <donation />
    </div>
    <div id="we" class="rookheas">
      <we />
    </div>
    <div id="join" class="rookheas"></div>
  </div>
</template>

<script lang="ts">
import { defineComponent } from "vue";
import headsVue from "@/components/headsoor/heads.vue";
import homeVue from "@/components/pCs/home.vue";
import abouts from "@/components/pCs/abouts.vue";
import love from "@/components/pCs/love.vue";
import donation from "@/components/pCs/donation.vue";
import we from "@/components/pCs/we.vue";
export default defineComponent({
  name: "HomeView",
  components: {
    headsVue,
    homeVue,
    abouts,
    love,
    donation,
    we,
  },
});
</script>
<style lang="less">
.Rookies_home {
  height: 100%;
  background-color: var(--bgColor);
  transform: scale(1);
  // cursor: url(../assets/shub.png);
  //  cursor:default;
  cursor: unset;
  .rookheas {
    min-height: 1000px;
    ---hesihts:1000px
    height: 100%;
    display: flex;
    justify-content: center;
  }
}
</style>
